Vue.component('edit-view', {
    // 只读 
    props: ['name', 'major', 'address', 'phone', 'qq'],
    template: `<form @submit.prevent="save">
                    <input type="text" placeholder="请输入姓名" v-model="namev"> <br><br>
                    <input type="text" placeholder="请输入职位" v-model="majorv"> <br><br>
                    <input type="text" placeholder="请输入地址" v-model="addressv"> <br><br>
                    <input type="text" placeholder="请输入联系方式" v-model="phonev"> <br><br>
                    <input type="text" placeholder="请输入qq" v-model="qqv"> <br><br>
                    <input type="submit" value="保存"> <br><br>
                </form>`,
    // 如果需要修改 props 的值,可以使用 data 代替
        data: function () {
            return {
                namev: this.name,
                majorv: this.major,
                addressv: this.address,
                phonev: this.phone,
                qqv: this.qq,
            }
        },
        methods:{
            save: function (){
                // 把修改后的数据传递到父组件
                // 触发事件
                console.log(`i love you , do you know `);
                console.log(this.namev);
                
                this.$emit('changedata',this.namev,this.majorv,this.addressv,this.phonev,this.qqv,)
            }
        }

})

new Vue({
    el: '#app',
    data: {
        name: '独狼',
        major: '程序员',
        address: '经开五大街经北三路',
        phone: '15736978100',
        qq: '1419867352',

        isShow: false,
    },
    methods:{
        getNewData: function (name,major,address,phone,qq){
            this.name=name;
            this.major=major;
            this.address=address;
            this.phone=phone;
            this.qq=qq;

            this.isShow=false;
        }
    }
})

// Vue.component('one',{
//     template:
//     '\
//      <ul>\
//         <li></li>\
//     </ul>\
//     '
// })